<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=medium-dpi" />
<title> ::: 골프인 :::</title>
<link rel="stylesheet" type="text/css" href="../css/common.css">
<script  src="../js/common.js"></script>
<script  src="../js/jquery.js"></script>
<script src="../js/jquery.mobile-1.1.0.js"></script>
</head>

<body>
<section id="my_modify" data-role="page" data-theme="d" class="container gray_bg">
    <!--top-->
    <header data-role="header" data-position="fixed">
        <!--top navi-->
        <nav data-role="navbar" data-theme="a" id="top_gnb">
            <ul>
                <li><a id="main_menu_btn" href="#" data-transition="slide">
                    <span class="ico_navi navi1">icon</span> <span class="navi_txt">Menu</span>
                </a></li>
                <li><a id="main_noti_btn" href="#" data-transition="slide">
                    <span class="ico_navi navi2">icon</span> <span class="navi_txt">알림</span>
                    <!--새글이 있을때만 보이는 new 아이콘-->
                    <span class="ico_navi navi3">new icon</span>
                </a></li>
            </ul>
        </nav><!-- // id="top_gnb" 끝  -->
        
        <!--title-->
        <div class="top_title_G">
            <h2>개인정보 변경</h2>
            <!--left  btn-->
            <div class="top_left">
                <a href="#" data-rel="back" data-direction="reverse" class="ico_btn btn2">이전</a>
            </div>
        </div><!-- // class="top_title_G" 끝  -->
    </header><!-- // header  -->
    
    <!--메인 컨텐츠-->
    <section data-role="content" data-theme="d">
        <form action="#" method="#">
            <ul class="join_form">
                <!--이름 -->
                <li data-role="fieldcontain">
                    <fieldset>
                        <legend>이름</legend>
                        <div class="join_mod">홍길동</div>
                    </fieldset> 
                </li>
                
                <!--아이디 -->
                <li data-role="fieldcontain">
                    <fieldset>
                        <legend>아이디</legend>
                        <div class="join_mod">abcsky72</div>
                    </fieldset> 
                </li>
                
                <!--닉네임 -->
                <li data-role="fieldcontain">
                    <fieldset>
                        <legend>닉네임</legend>
                        <div class="ui-grid-a block1">
                            <div class="ui-block-a"><input type="search" placeholder="2~6자 이하" /> </div>
                            <div class="ui-block-b"><a  data-inline="true" data-role="button">중복확인</a></div>
                        </div>
                        <!--사용중일때 보일는 txt-->
                        <div class="con_ok">이미 사용중인  닉네임 입니다.</div>
                        
                        <!--사용가능할때 보일는 txt-->
                        <div class="con_re">사용 가능한  닉네임 입니다.</div>
                    </fieldset> 
                </li>
                
                <!--비밀번호 -->
                <li data-role="fieldcontain">
                    <fieldset>
                        <legend>비밀번호 변경</legend>
                        <input type="password" placeholder="4~12자 이하 영문 또는 숫자" /> 
                    </fieldset> 
                </li>
                
                <!--비밀번호확인 -->
                <li data-role="fieldcontain">
                    <fieldset>
                        <legend>비밀번호 변경 확인</legend>
                        <input type="password" placeholder="4~12자 이하 영문 또는 숫자" /> 
                    </fieldset> 
                </li>
                
                <!--휴대폰 -->
                <li data-role="fieldcontain">
                    <fieldset>
                        <legend>휴대폰</legend>
                        <select data-theme="c">
                            <option value="#">SKT</option>
                            <option value="#">KT</option>
                            <option value="#">LG유플러스</option>
                        </select>
                        <div class="form1">
                            <select data-theme="c">
                                <option value="#">010</option>
                                <option value="#">011</option>
                                <option value="#">016</option>
                                <option value="#">017</option>
                                <option value="#">018</option>
                                <option value="#">019</option>
                            </select>
                               -   
                            <input type="text" />  -   <input type="text" />
                        </div><!-- //  class="form1" -->
                        <div class="ui-grid-a block2">
                            <div class="ui-block-a"><input type="text" placeholder="인증번호를 입력하세요" /> </div>
                            <div class="ui-block-b"><a  data-inline="true" data-role="button">인증번호받기</a></div>
                        </div>
                        <p class="txt">※  휴대폰 인증번호 확인을 하지 않으면  조인룸, 부킹 이용이 제한 됩니다.</p>
                    </fieldset> 
                </li>
                
                <!--이메일 주소 -->
                <li data-role="fieldcontain">
                    <fieldset>
                        <legend>이메일 주소</legend>
                        <div class="form2">
                            <input type="email" />  @  <input type="email" />                            
                        </div><!-- //  class="form2" -->
                        <div class="ui-grid-a block1">
                            <div class="ui-block-a">
                                <select data-theme="c">
                                    <option value="#">직접입력</option>
                                    <option value="#">네이버</option>
                                    <option value="#">다음</option>
                                    <option value="#">네이트</option>
                                    <option value="#">드림위버</option>
                                </select>
                            </div>
                            <div class="ui-block-b"><a data-inline="true" data-role="button">중복확인</a></div>
                        </div><!-- //  class="ui-grid-a" -->
                        
                        <p class="txt ma_bottom10">※  이메일 주소를 모르시면 ID찾기, 비밀번호 재발급을 이용하실 수 없습니다. 이메일 주소를 꼭 기억해 주시기 바랍니다.</p>
                        
                        <input type="checkbox" name="#" id="a1" data-theme="c" /><!-- id값과 for값이 동일하게 작업하세요!  -->
                        <label for="a1">이벤트 및 정보메일 수신 </label>
                    </fieldset> 
                </li>
                
                <!--성별 -->
                <li data-role="fieldcontain">
                    <fieldset data-role="controlgroup" data-type="horizontal">
                        <legend>성별</legend>
                        <input type="radio" name="#" id="b1" checked="checked" /><!-- id값과 for값이 동일하게 작업하세요!  -->
                        <label for="b1">남자</label>
                        <input type="radio" name="#" id="b2" /><!-- id값과 for값이 동일하게 작업하세요!  -->
                        <label for="b2">여자</label>
                    </fieldset> 
                </li>
                
                <!--조인룸 초대 수신 여부  -->
                <li data-role="fieldcontain">
                    <fieldset data-role="controlgroup" data-type="horizontal">
                        <legend>조인룸 초대 수신 여부 </legend>
                        <span class="ans">다른 골프인 회원의 조인룸 초대를 받으시겠습니까?</span>
                        <input type="radio" name="#" id="c1" /><!-- id값과 for값이 동일하게 작업하세요!  -->
                        <label for="c1">예</label>
                        <input type="radio" name="#" id="c2" checked="checked" /><!-- id값과 for값이 동일하게 작업하세요!  -->
                        <label for="c2">아니오</label>
                    </fieldset> 
                </li>
            </ul><!-- //  class="join_form" 끝  -->
            
            <!--btn-->
            <div data-role="fieldcontain" class="ui-grid-a join_bt">
                <div class="ui-block-a"><a href="join_02.html" data-role="button" data-theme="a" data-transition="slide" >수정</a></div>
                <div class="ui-block-b"><a data-theme="d" data-role="button">취소</a></div>
            </div>
            
        </form>
        <p class="mem_txt">회원탈퇴 및 기타 마이 골프인 메뉴 이용은<br /><em>PC버전으로 이동</em>하여 주시기 바랍니다.</p>
    </section><!-- // content -->
</section><!-- // page -->
</body>
</html>
